<!DOCTYPE html>
<html>
<head>
    {% include "part/head-meta-link.html" ignore missing with context %}
    <title></title>
    <link rel="stylesheet" type="text/css" href="/static/css/tu.css">
    <link rel="stylesheet" type="text/css" href="/static/css/home.css">
</head>
<body>
    <div class="am-mdiv">
      <ul class="am-nav am-nav-tabs am-nav-justify" id="ul_daohang">
        <li id="main-one" class="am-active"><a href="#">进程管理器</a></li>
        <li id="main-two"><a href="#">CPU使用</a></li>
        <li id="main-three"><a href="#">内存使用</a></li>
        <li id="main-four"><a href="#">硬盘容量</a></li>
        <li id="main-five"><a href="#">内容查询</a></li>
        <li id="main-six"><a href="#">关于电脑</a></li>
      </ul>
    </div>

    <div class="main-host">
      <div class="main-six">正在写入</div>

      <div class="main-five">
          <div class="txt-con">
              <input type="text" name="ph" class="am-text-secondary">
              <button type="button" class="btn-cha am-btn am-btn-primary am-btn-xs am-radius">查询路径</button>
              <button type="button" class="btn-cha-file-content am-btn am-btn-primary am-btn-xs am-radius">查询内容</button>
              <i class="" id='i-zhuan'></i>
          </div>
          
          <div class="zhong_xia" id="zhong_x"></div>
      </div>

      <div class="main-four">
       <!--  <div class="disk-fu">
          {% for i in udisk %}
              <span class="sp_C">{{ i }}盘</span></br>
          {% endfor %}
        </div> -->
          {% for i in udisk %}
          <div class="disk_use">
          <div class="sp_C">{{ i }}盘</div>
          <div class="am-progress am-progress-striped am-active" style="margin-bottom: 6px;">
            {{ udisk[i][0] }}<div class="am-progress-bar am-progress-bar-secondary" style="width: {{ udisk[i][0] }}"></div>
          </div>
          <div class="disk_zong">{{ udisk[i][2] }}G可用, 共：{{ udisk[i][1] }}G</div>
          </div>
          {% endfor %}
        <!-- <div> -->
          <!-- {% for i in udisk %}
          <span style="line-height: 46px;">总：{{ udisk[i][1] }}G</span></br>
          {% endfor %} -->
        <!-- </div> -->
      </div>

      <div class="main-one">
        <div style="margin-left: 14%;">
          <input type="text" id="search" placeholder="请键入进程ID,多个ID用空格分隔!">
          <button class="btn"> 结束进程</button>
              <div>
                    <table>
                      <tr>
                        <th width="60px" class="ct">选择</th>
                        <td width="80px">进程ID</td>
                        <td width="300px">进程</td>
                        <td width="100px">状态</td>
                        <td width="100px">cpu使用率</td>
                      </tr>
                    </table>
              </div>
              <div style="width:700px;height: 500px;" id="tab" class="am-scrollable-vertical">
              </div>
        </div>
      </div>

      <div class="main-two">
        <div><span>CPU使用情况</span></div>
        <canvas id="canvas_circle" width="700" height="440"> </canvas>
      </div>

      <div class="main-three">
        <div><span>磁盘使用情况</span></div>
        <canvas id='canvas_cipan' width='700' height='440'> </canvas> 
      </div>
    </div>

    <script type="text/javascript">
        // 确保GLOBAL存在
        if(!window.GLOBAL) {
            window.GLOBAL = {};
        }
        GLOBAL.USER_FOLDER_LIST_URL = "{{ url_for('view_folder_list') }}";
        GLOBAL.USER_FOLDER = "{{ url_for('view_folder_list_con') }}";
        GLOBAL.PROCESS_LIST = "{{ url_for('view_process') }}";
        GLOBAL.KILL_URL = "{{ url_for('kill_process') }}";
    </script>
    {% include "part/body-script-src.html" ignore missing with context %}
    <script type="text/javascript" src="/static/js/tu.js"></script>

</body>
</html>